<template>
<div style="width: 100%">
  <a-card class="card" :bordered="false">
    <div class="table-page-search-wrapper">
      <a-form layout="vertical">
        <a-row :gutter="48">
        <a-col :sm="{span:12}" :lg="{span:12}"  >
          <a-form-item label="报考院系">
          <a-select :disabled="selectMenu.yx.length === 1" :allowClear="true" showSearch optionFilterProp="children" v-model="queryParam.bkyxsm" @change="yxChange">
            <a-select-option v-for="i in selectMenu.yx" :key="i.id" :value="i.dwh">{{ i.dwh +'-'+i.dwmc }}</a-select-option>
          </a-select>
        </a-form-item>
        </a-col>
        <a-col :sm="{span:12}" :lg="{span:12}"  >
          <a-form-item label="报考专业">
          <a-select :allowClear="true" showSearch optionFilterProp="children" v-model="queryParam.bkzydm" @change="zyChange">
            <a-select-option v-for="i in selectMenu.zy" :key="i.id" :value="i.zyh">{{ i.zyh+'-'+i.zymc }}</a-select-option>
          </a-select>
        </a-form-item>
        </a-col>
        <a-col :sm="{span:12}" :lg="{span:12}"  >
          <a-form-item label="报考研究方向">
          <a-select :allowClear="true" showSearch optionFilterProp="children" v-model="queryParam.bkyjfxm">
            <a-select-option v-for="i in selectMenu.fx" :key="i.id" :value="i.yjfxm">{{ i.yjfxm.substring(i.yjfxm.length-2) +"-"+ i.yjfxmc }}</a-select-option>
          </a-select>
        </a-form-item>
        </a-col>
         <a-col :sm="{span:12}" :lg="{span:12}">
              <a-form-item label="准考证号">
                <a-input placeholder="请输入..." v-model="queryParam.ksbh" />
              </a-form-item>
            </a-col>
       </a-row>
       <div style="float:right;text-align:right">
            <a-upload
              :fileList="fileList"
              :remove="handleRemove"
              :beforeUpload="beforeUpload"
            >
              <a-button type="primary" >选择文件</a-button>
              <a-button
                type="primary"
                @click.stop="handleImport"
                :disabled="fileList.length === 0"
                :loading="uploading"
              >
                {{uploading ? 'Uploading' : '导入' }}
              </a-button>
            </a-upload>
          </div>
        <div style="text-align:center">
          <a-button type="primary" @click="loadData">查询</a-button>
          <!-- <a-button type="primary" @click="handleExport">导出</a-button>
          <a-button type="primary" @click="handleEdit" :disabled="EditStop">录入(修改)</a-button>
          <a-button type="primary" @click="handleSave" :disabled="!EditStop">保存</a-button>
          <a-button type="primary"  @click="handleCompute">综合评定计算</a-button> -->
          <a-button type="primary"  @click="handleDownload">下载导入模版</a-button>
        </div>
      </a-form>
    </div>
    </a-card>
    <!-- <a-alert class="card" style="margin-bottom:0" message="※温馨提示：单页数据录入完请及时保存，若无点击保存按钮，翻页则数据清空" banner />
    <a-alert class="card"  message="※综合评定成绩300=初试成绩/3*初试成绩权重+复试成绩*复试成绩权重/ ※综合评定成绩500=初试成绩/5*初试成绩权重+复试成绩*复试成绩权重" banner /> -->
    <a-card :bordered="false">
       <div class="table-page-search-wrapper">
      <a-form layout="inline">
        <a-row :gutter="48">
        <!-- <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}"  >
          <a-form-item label="复试成绩所占比例">
            <a-input placeholder="请输入..." addonAfter="%" v-model='fscjqz'/>
        </a-form-item>
        </a-col>
        <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}"  >
          <a-form-item label="综合成绩计算办法">
            <a-select :allowClear="true" showSearch optionFilterProp="children" v-model="zhpdjsgs">
            <a-select-option v-for="i in zhcj" :key="i.id" :value="i.id">{{ i.name }}</a-select-option>
          </a-select>
        </a-form-item>
        </a-col>

        <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}"  >
          <a-form-item label="总成绩折算办法">
            <a-input placeholder="请输入..."  v-model="zcjzsbf" :disabled='isAble' @change="bfChange"/>
        </a-form-item>
        </a-col> -->

       <!-- <a-col :sm="{span:12}" :lg="{span:12}"  >
          <a-form-item label="二志愿调剂考生所降分数">
             <a-input placeholder="请输入..."/>
        </a-form-item>
        </a-col> -->
       </a-row>
      </a-form>
    <a-table
      ref="table"
      size="default"
      rowKey="key"
      :columns="columns"
      :loading="loading"
      :dataSource="data"
      :pagination="pagination"
      @change="handleTableChange"
    >
      <template slot="fscj" slot-scope="text,record">
         <a-input placeholder="请输入..." :value="text" :disabled="!EditStop" @change="e => handleChange(record.id,'fscj',e.target.value)"/>
      </template>
      <template slot="zhpd" slot-scope="text,record">
         <a-input placeholder="请输入..." :value="record.zhpd" :disabled="!EditStop" @change="e => handleChange1(e.target.value,record)"/>
      </template>
      <template slot="zhpm" slot-scope="text,record">
         <a-input placeholder="请输入..." :value="record.zhpm" :disabled="!EditStop" @change="e => handleChangepm(e.target.value,record)"/>
      </template>
       <template slot="zcjzsbf" slot-scope="text,record">
         <a-input placeholder="请输入..." :value="record.zcjzsbf" disabled @change="e => handleChange2(e.target.value,record)"/>
      </template>
      <span slot="serial" slot-scope="text, record, index">
        {{ index + 1 }}
      </span>
    </a-table>
       </div>
    </a-card>
</div>
</template>

<script>
// import moment from 'moment'
import { STable } from '~'
import { mapState } from 'vuex'

const selectArr = ['TYPE0126', 'TYPE0075', 'TYPE0125', 'TYPE0072']

export default {
  components: {
    STable
  },
  data () {
    return {
      loading: false,
      data: [],
      EditStop: false,
      zhpdjsgs:'5',
      fileList: [],
      uploading: false,
      // 查询参数
      queryParam: {
        bkzydm: '',
        bkyxsm:''
      },
      postParams: {},
      // 表头
      columns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'serial' }
        },
        {
          title: '准考证号',
          dataIndex: 'ksbh'
        },
        {
          title: '姓名',
          dataIndex: 'ksxm'
        },
        {
          title: '报考院系',
          dataIndex: 'bkyxsmc'
        },
        {
          title: '报考专业',
          dataIndex: 'bkzymc'
        },
        {
          title: '研究方向',
          dataIndex: 'bkyjfxmc'
        },
        {
          title: '总分',
          dataIndex: 'zf'
        },
        {
          title: '总分加分',
          dataIndex: 'zfjf'
        },
        {
          title: '初试成绩权重(%)',
          dataIndex: 'cscjqz'
        },
        {
          title: '复试成绩',
          dataIndex: 'fscj',
          scopedSlots: { customRender: 'fscj' }
        },
        {
          title: '复试成绩权重(%)',
          dataIndex: 'fscjqz'
        },
        {
          title: '综合评定',
          dataIndex: 'zhpd',
          scopedSlots: { customRender: 'zhpd' }
        },
        {
          title: '综合排名',
          dataIndex: 'zhpm',
          scopedSlots: { customRender: 'zhpm' }
        },
        {
          title: '总成绩折算办法',
          dataIndex: 'zcjzsbf',
          scopedSlots: { customRender: 'zcjzsbf' }
        }
      ],
      selectMenu: {
        yx: [] ,// 院系
        zy:[]
      },
      recruitEditData: {},
      pagination:{
        current:1
      },
      fscjqz:'',
      currentYear:'',
      zcjzsbf:'',
      zhpm:'',
      zhcj:[
        {
          id:'3',
          name:'综合评定成绩300'
        },
        {
          id:'5',
          name:'综合评定成绩500'
        }
      ]
    }
  },
  computed: {
    ...mapState({
      systemInfo: state => state.app.systemInfo,
      TYPE0126: state => state.app['TYPE0126'] // 年级
    }),
    isAble(){
      if(this.queryParam.bkzydm){
        return false
      }else {
        return true
      }
    }
  },
  created () {
    this.initSelectMenu()

    selectArr.forEach(v => {
      this.$store.dispatch('app/setDictionary', v)
    })
  },
  methods: {
    initSelectMenu () {
      let allRequest = [
        this.$api.base.collegeAll(),
        new Promise((resolve,reject) => {
           // 获取当前学年
        this.$api.base.getSchoolYear().then(res=>{
          this.currentYear = res.data.masterAdmissionYear
          resolve(this.currentYear)
        })
        })
      ]
      Promise.all(allRequest).then(res => {
        this.selectMenu = {
          yx: res[0].data
        }
        this.queryParam.bkyxsm = res[0].data[0].dwh
        this.$api.base.majorAll({lsdwh: this.queryParam.bkyxsm}).then(res => {
          this.$set(this.selectMenu, 'zy', res.data)
          this.queryParam.bkzydm = res.data[0].zyh
          this.loadData({
            pageSize: 10,
            pageNum: 1
          })
          this.getDurection(this.queryParam.bkzydm)
        })

      })
    },
     // 加载数据
    loadData (parameter = {}) {
        if(!parameter.pageNum){
          this.pagination.current = 1
          parameter.pageNum = 1
          pageSize: 10
        }
    	 let params = Object.assign(this.queryParam, parameter)
       this.loading = true
        this.$api.recruitstat.reExamScoreManageList(params).then(res=>{
             const pagination = { ...this.pagination
            };
            pagination.total = 0
            if (res.data && res.data.total) {
              pagination.total = res.data.total;
            }
            this.data = []
            this.pagination = pagination;
            if (res.data && res.data.rows.length) {
              this.data = res.data.rows;
            }
            this.loading = false;
        })
    },
    // 分页
    handleTableChange (pagination, filters, sorter) {
    	console.log(pagination);
    	const pager = { ...this.pagination };
    	pager.current = pagination.current;
    	this.pagination = pager;
    	this.loadData({
    		pageSize: 10,
    		pageNum: pagination.current
    	});
    },
    // 选择院系
    yxChange (code) {
      this.$set(this.queryParam, 'bkzydm', '')
      this.$set(this.selectMenu, 'zy', [])
      if(code){
        this.getProssion(code)
      }
    },
    getProssion(code){
      this.$api.base.majorAll({lsdwh: code}).then(res => {
        this.$set(this.selectMenu, 'zy', res.data)
      })
    },
    //选择专业
    zyChange(code){
      this.zcjzsbf = ''
       this.$set(this.queryParam, 'bkyjfxm', '')
        this.$set(this.selectMenu, 'fx', [])
        if(code){
          this.getDurection(code)
        }
    },
    getDurection(code) {
        this.$api.base.searchDirectory({
          ssyxm: this.queryParam.bkyxsm,
          zsxn: this.currentYear,
          sszym: code,
           xwccm: 2
        }).then(res => {
          this.$set(this.selectMenu, 'fx', res.data)
        })
      },
    // 选择招生年度
    zsndChange () {

    },
    handleRemove (file) {
      const index = this.fileList.indexOf(file)
      const newFileList = this.fileList.slice()
      newFileList.splice(index, 1)
      this.fileList = newFileList
    },
    beforeUpload (file) {
      this.fileList = [...this.fileList, file]
      return false
    },
    // 导入
    handleImport () {
      console.log('开始导入')
      const { fileList } = this
      const formData = new FormData()
      fileList.forEach((file) => {
        formData.append('file', file)
      })
      this.uploading = true
      console.log(fileList)
      this.$uploadToDow('admissions/fscjgl/importFscjgl',formData).then( res => {
        this.$nextTick(()=> {
          console.log(res)
          if(res && res.status == 500){
            this.$message.erroe(res.msg)
          }else if(res && res.status == 200){
            this.$message.success('导入成功！')
            this.loadData()
          }else{
            this.$message.error("导入失败！")
          }
        })
      }).finally(res=>{
        this.uploading=false
      })
    },
    // 导出
    handleExport (data) {
      console.log('导出')
       this.$export('admissions/fscjgl/export',this.queryParam)
    },
    handleDownload(){
      this.$export('admissions/fscjgl/xlsxExport',this.queryParam)
    },
    // 修改
    handleEdit (data) {
      if (this.EditStop) {
        return
      }
      this.EditStop = true
      console.log('修改')
    },
    // 保存
    handleSave () {
      this.EditStop = false
      console.log('保存')
      if(!this.fscjqz){
        this.$message.warn('请输入复试成绩所占比例');
        return ;
      }
      var newArr = []
      this.data.map((item,index) => {
        newArr[index] = {
          id:item.id,
          fscj:item.fscj,
          zhpd:item.zhpd,
          zcjzsbf:item.zcjzsbf,
          zhpm:item.zhpm,
        }
      })
      var params = {
        bkyxsm:this.queryParam.bkyxsm,
        bkzydm:this.queryParam.bkzydm,
        pageNum:this.queryParam.pageNum,
        pageSize:this.queryParam.pageSize,
        fscjqz:this.fscjqz,
        idFscjs:JSON.stringify(newArr)
      }
      this.$api.recruitstat.reExamScoreManageAdd(params).then( res =>{
          this.loadData({
          	pageSize: 10,
          	pageNum: this.pagination.current
          });
      })
    },
    // 修改成绩
    handleChange (key, dataIndex, value) {
      const dataSource = [...this.data]
      const target = dataSource.find(item => item.id === key)
      if (target) {
        target[dataIndex] = value
        this.data = dataSource
      }
    },
    handleChange1 (value,tt) {
      this.$set(tt,'zhpd',value)
    },
    handleChangepm (value,tt) {
      this.$set(tt,'zhpm',value)
    },
      handleChange2 (value,tt) {
      this.$set(tt,'zcjzsbf',value)
      this.data.forEach(item =>{
        if(item.bkzydm == tt.bkzydm){
          this.$set(item,'zcjzsbf',value)
        }
      })
    },
    bfChange(e){
      this.data.forEach(item =>{
        if(item.bkzydm == this.queryParam.bkzydm){
          this.$set(item,'zcjzsbf',e.target.value)
        }
      })
      console.log(e.target.value)
    },
    // pmChange(e){
    //   this.data.forEach(item =>{
    //     if(item.bkzydm == this.queryParam.bkzydm){
    //       this.$set(item,'zhpm',e.target.value)
    //     }
    //   })
    //   console.log(e.target.value)
    // },
    handleCompute(){
      let params =Object.assign({'zhpdjsgs':this.zhpdjsgs},this.queryParam)
      this.$api.recruitstat.reExamTotalList(params).then( res => {
         this.loadData({
        	pageSize: 10,
        	pageNum: this.pagination.current
        });
      })
    }
  }
}
</script>

<style lang="less" scoped>
.card{
  margin-bottom: 20px;
}
/deep/ .ant-upload-list-item-info{
  padding: 0px 30px 0 4px;
}
</style>
